<template>
  <!-- 当mescroll-body写在子组件时,父页面需引入mescroll-comp.js的mixins -->
  <mescroll-body
    ref="mescrollRef"
    top="92px"
    bottom="100rpx"
    :down="{
      auto: false,
      use: false
    }"
    @init="mescrollInit"
    @down="downCallback"
    @up="upCallback"
  >
    <GoodsItem v-for="item in goods" :key="item.id" :dataValue="item" />
  </mescroll-body>
</template>

<script>
import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js'
import GoodsItem from './goodsItem.vue'

import { purchaseList } from '@/api/http/wantBuy'

export default {
  mixins: [MescrollMixin], // 使用mixin
  components: {
    GoodsItem
  },
  props: {
    searchVal: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      goods: []
    }
  },
  created() {
  },
  watch: {
    searchVal: {
      handler() {
        this.$nextTick(() => {
          this.mescroll.resetUpScroll()
        })
      },
      deep: true
    }
  },
  methods: {
    upCallback(page) {
      purchaseList({
        pageNo: page.num,
        pageSize: page.size,
        ...this.searchVal
      })
        .then((res) => {
          if (res.code === 200) {
            if (page.num == 1) this.goods = [] //如果是第一页需手动制空列表
            this.goods = this.goods.concat(res.data.records)
            this.mescroll.endSuccess(res.data.records.length)
          } else {
            this.mescroll.endErr()
          }
        })
        .catch(() => {
          this.mescroll.endErr()
        })
    },
  }
}
</script>
